<template>
  <div>

    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
      <el-menu-item index="1">作业管理</el-menu-item>
      <el-menu-item index="2"@click="jump">文件管理</el-menu-item>
    </el-menu>
    <div class="line"></div>


  <el-card style="padding: 10px">

    <el-form :model="queryParams">
      <el-input
        style="width: 240px"
        v-model="queryParams.teacherId"
        placeholder="请输入..."
      /><el-button @click="A">查 询</el-button>
      <el-button style="margin-left: 0px" @click="topicAdd">添加作业</el-button>
    </el-form>


    <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        >
      <el-table-column type="selection"></el-table-column>
      <el-table-column label="id" align="center" prop="id" width="55px" v-if="false"/>
      <el-table-column label="作业名" align="center" prop="title" />
      <el-table-column label="创建者" align="center" prop="creator" />
      <el-table-column label="发布时间" align="center" prop="startTime" />
      <el-table-column label="截止时间" align="center" prop="endTime" />
      <el-table-column label="操作">
        <template slot-scope="scope">
<!--          <el-button type="primary" size="mini" @click="editTime(scope.row)">编辑</el-button>-->
          <el-button type="primary" size="mini" @click="QuestionDetail(scope.row)">查看</el-button>
<!--          <el-button type="primary" size="mini" @click="TopicPut(scope.row)">发布</el-button>-->
          <el-button type="primary" size="mini" @click="TopicOut(scope.row)">发布</el-button>
          <el-button type="primary" size="mini" @click="TopicDelete(scope.row)">删除</el-button>

        </template>
      </el-table-column>
    </el-table>
  </el-card>

    <el-dialog title="编辑" :visible.sync="dialogFormVisible0" width="50%" >
      <el-form label-width="120px">
        <el-form-item label="标题">
          <el-input v-model="form3.title" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="描述">
          <el-input v-model="form3.description" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="时间">
        <el-date-picker
          v-model="form3.startTime"
          type="datetime"
          format="yyyy-MM-dd HH:mm:ss"
          value-format="yyyy-MM-dd HH:mm:ss"
          placeholder="选择日期时间">
        </el-date-picker>
        ---
        <el-date-picker
          v-model="form3.endTime"
          type="datetime"
          format="yyyy-MM-dd HH:mm:ss"
          value-format="yyyy-MM-dd HH:mm:ss"
          placeholder="选择日期时间">
        </el-date-picker>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible0 = false">取 消</el-button>
        <el-button type="primary" @click="okk">确 定</el-button>
      </div>
    </el-dialog>


    <el-dialog title="添加作业" :visible.sync="dialogFormVisible" width="30%" size="small">
      <el-form label-width="60px">
        <el-form-item label="作业名">
          <el-input v-model="form.title" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="描述">
          <el-input v-model="form.description" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="save">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="发布作业" :visible.sync="dialogFormVisible2" width="30%" size="small">
      <el-form label-width="120px">
        <el-form-item label="班级">
          <el-select v-model="form2.classId" placeholder="请选择">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.name"
              :value="item.classId">
            </el-option>
          </el-select>
        </el-form-item>

      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible2 = false">取 消</el-button>
        <el-button type="primary" @click="putT">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="发布作业" :visible.sync="dialogFormVisible4" width="30%" size="small">
      <el-form label-width="120px">
        <el-form-item label="时间">
          <el-date-picker
            v-model="form4.startTime"
            type="datetime"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间">
          </el-date-picker>
          ---
          <el-date-picker
            v-model="form4.endTime"
            type="datetime"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="班级">
          <el-select v-model="form5.classId" placeholder="请选择">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.name"
              :value="item.classId">
            </el-option>
          </el-select>
        </el-form-item>

      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible4 = false">取 消</el-button>
        <el-button type="primary" @click="xxx">确 定</el-button>
      </div>
    </el-dialog>

  </div>

</template>

<script>
  import { getUserProfile } from "@/api/system/user";
  import {searchClass, queryCourseList,saveTopic,queryCourseListByCreator,queryCourseListByTitle,queryByTopic,DeleteTopic,PutTopic,queryTopicById,updateTime} from "@/api/teacher/detail/course/QuestionBank";



export default {

  name: "QuestionBank",

  created() {
    this.getUser();
  },
  data(){
    return {
      options: [],
      value: "",
        data: {
        date: []
      },
      visible: false,
      dialogFormVisible0:false,
      dialogFormVisible:false,
      dialogFormVisible2:false,
      dialogFormVisible4:false,
      form:{},
      form2:{
        topicId:'',
        classId:''
      },
      form3:{},
      form4:{},
      form5:{
        topicId:'',
        classId:''
      },
      activeIndex: '1',
      activeIndex2: '1',
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        teacherId: null,
      },
      user: {},
      tableData: []
    }
  },
  methods: {
    TopicOut(row){
      this.dialogFormVisible4 = true
      queryTopicById(row.id).then(response => {
        this.form4 = response
      })

      this.form5 = {}
      this.form5.topicId = row.id
      getUserProfile().then(response => {
        this.teacherId = response.data.userName;
        searchClass(this.teacherId).then(response => {
          this.options = response;
        })
      })

    },
    xxx(){
      updateTime(this.form4).then(response =>{
        if (response.code === 200){
          this.$message.success("修改时间成功")
          this.dialogFormVisible4 = false


          PutTopic(this.form5).then(response => {
            console.log('this.form5')
            console.log(this.form5)
            if (response.code === 200){
              this.$message.success("发布作业成功")

            }else {
              this.$message.error("发布作业失败")
            }
          })

          this.getUser();
        }else {
          this.$message.error("修改时间失败")
        }
      })
    },
    //确认修改时间
    okk(){

      // console.log(this.form3.timeValueArr[0])
      updateTime(this.form3).then(response =>{
          if (response.code === 200){
            this.$message.success("修改时间成功")

            this.getUser();
          }else {
            this.$message.error("修改时间失败")
          }
      })
    },
    //编辑 获取作业信息
    editTime(row){
      this.dialogFormVisible0 = true
      queryTopicById(row.id).then(response =>{
        this.form3 = response
        console.log(response)
      })

    },
    //发布 搜索可选课程
    TopicPut(row){
      this.dialogFormVisible2 = true
      this.form2 = {}
      this.form2.topicId = row.id
      getUserProfile().then(response => {
        this.teacherId = response.data.userName;
        searchClass(this.teacherId).then(response =>{
        this.options = response;
      })
      })

    },
    //发布确定
    putT(){
      PutTopic(this.form2).then(response => {
        console.log('this.form2')
        console.log(this.form2)
        if (response.code === 200){
          this.$message.success("发布作业成功")
          this.dialogFormVisible2 = false
        }else {
          this.$message.error("发布作业失败")
        }
      })
    },
    save(){
      saveTopic(this.form).then(response =>{
        if (response.code === 200){
          this.$message.success("添加作业成功")
          this.dialogFormVisible = false
          queryByTopic(this.form.title).then(response => {//通过title查询id
            const att = response[0].id
            this.queryCourseListByTitle(att)
          })
        }else {
          this.$message.error("添加作业失败")
        }
      })
    },
    queryCourseListByTitle(att){
      this.$router.push({ path:'teacher/addTopic', query:{id :att}})
    },
    topicAdd(){
      this.dialogFormVisible = true,
        this.form = {}
        this.form.creator = this.user.nickName
    },
    TopicDelete(row){
      console.log(row)
      DeleteTopic(row.id).then(response =>{
        console.log(response)
        if (response.code === 200) {
          this.$message.success("删除成功")
          this.visible = false

          getUserProfile().then(response => {
            this.user = response.data;
            queryCourseListByCreator(this.user.nickName).then(response =>{
              this.tableData  = response
            })
          })
        }else
        {
          this.$message.error("删除失败")
        }
      })
    },
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
    },
    QuestionDetail(row){
       this.$router.push({ path: 'teacher/addTopic', query: { id: row.id }})

    },
    QuestionOpen(row){

    },
    getUser() {
      getUserProfile().then(response => {
        this.user = response.data;

        queryCourseListByCreator(this.user.nickName).then(response =>{
          this.tableData  = response
        })
      });
    },
    A(){
      getListT(this.queryParams.teacherId).then(response =>{
        this.tableData  = response
      })
    },
    jump(){
      this.$router.push('teacher/FileBank')
    },
    B(){

    }
  }
}
</script>

<style scoped>

</style>
